<template lang="html">
  <div class="index">
    <Banners :swiperSlides='swiperSlides' />
    <OneDaily />
    <GambitList :gambitlistData='gambitlistData'/>
    <BottomNav />
  </div>
</template>

<script>
import Banners from '../components/Index/Banners'
import OneDaily from '../components/Index/OneDaily'
import GambitList from '../components/Index/GambitList'
import BottomNav from '../components/BottomNav'
export default {
  name:'Index',
  components:{
    Banners,
    OneDaily,
    GambitList,
    BottomNav
  },
  data(){
    return{
      swiperSlides:[],
      gambitlistData:[]
    }
  },
  created(){
    // Banners网络请求
    this.$axios.get(this.HOST + '/api/banner')
    .then(res => {
      // console.log(res.data);
      this.swiperSlides = res.data
    })
    .catch(error => {
      console.log(error);
    })

    // gambitlist 网络请求
    this.$axios.get(this.HOST + '/api/gambitlist')
    .then(res => {
      // console.log(res.data);
      this.gambitlistData = res.data
    })
    .catch(error => {
      console.log(error);
    })
  }
}
</script>

<style lang="less" scoped>

.index{
  width: 100%;
  background-color: #f1f1f1;
  // overflow: hidden;
}

</style>
